import React, { Component } from "react";
import { Link } from "react-router-dom";
import _Http from "../../../config/api";
import {getCookie,delCookie,getDate} from '../../../config/omsCookiesFun';
export default class header extends Component {
  constructor(props) {
    super(props);
    this.handleChange = this.handleChange.bind(this);
    this.handleClick = this.handleClick.bind(this);
    this.state = {
    }
  }

  handleChange(e){
    var _this = this;
    (function($){
        var itemVal = $(e.target).val();
        if(itemVal){
          window.localStorage.setItem('lang',itemVal);
          _this.props.updateLangKey(itemVal);
        }
    })(window.jQuery)
  }
  handleClick(){//退出登录
    var _this = this, formData = '';
    if(getCookie('userInfo')){
      
      formData = new FormData();
      formData.append("action","loginOut");
      formData.append("sessionId",getCookie('sessionId'));

      delCookie('userInfo');
      delCookie('sessionId');
      
      _Http.post('/login.php', formData)
      .then(function () {
        _this.props.updateIsLogin(false);
      })
      .catch(function (error) {
        console.log(error);
      });
    }
    return false;
  }
  render() {
   var _this = this,
       langIndex = _this.props.langKey,
       userInfo = getDate(getCookie('userInfo')),
       pathname = window.location.pathname,
       translate = {
          cn:{
            "修改密码" : "修改密码",
            "退出登录" : "退出登录",
          },
          en:{
            "修改密码" : "Change Password",
            "退出登录" : "Logout",
          }
       },
       page = translate[langIndex];
    return (
      <header id="header" className="navbar navbar-static-top">
        <div className="navbar-header">
        {(pathname === '/login' || pathname === '/register')?'':<a type="button" id="button-menu" className="pull-left"><i className="fa fa-dedent fa-lg"></i></a>}
          <a href="/" className="navbar-brand">
            <img src="../../img/omsLogo.png" alt="tomrepair oms" title="tomrepair oms"/>
          </a>
          </div>
          <ul className="nav pull-right">
            <li>
                <select className="form-control language" onChange={_this.handleChange} value={langIndex}>
                  <option value="" >Select Language...</option>
                  <option value="en">English</option>
                  <option value="cn">简体中文</option>
              </select>
            </li>
            {
              userInfo.id ? <li className="dropdown dropdown-hover">
              <a className="dropdown-toggle">{userInfo.userName}<i className="fa fa-caret-down" style={{marginLeft: '5px'}}></i></a>
              <ul className="dropdown-menu dropdown-menu-right">
                <li><Link to="/system/updatePassword">{page['修改密码']}</Link></li>
                <li><a onClick={_this.handleClick}>{page['退出登录']}</a></li>
              </ul>
            </li>:''
            }
          </ul>
      </header>
     
    );
  }
}